import 'dart:async';
import 'dart:ui' as ui;

import 'package:cunyutech_flutter_ui/src/theme/main.dart';
import 'package:flutter/widgets.dart';

class AvatarLoadingItem extends StatefulWidget {
  AvatarLoadingItem({Key key, this.path, this.width }) : super(key: key);

  final String path;
  final double width;

  @override
  _AvatarLoadingItemState createState() => _AvatarLoadingItemState();
}

class _AvatarLoadingItemState extends State<AvatarLoadingItem> with TickerProviderStateMixin {
  AnimationController animationA;
  AnimationController animationB;
  bool showAnimationB = false;

  @override
  void initState() { 
    super.initState();
    init();
  }

  init() async {
    animationA = AnimationController(value: 0.125, duration: const Duration(milliseconds: 400), vsync: this);
    animationB = AnimationController(duration: const Duration(milliseconds: 400), vsync: this);
    animationA.addListener((){
      if(animationA.value >= 1){
        animationB.forward(from: 0);
        showAnimationB = true;
      }
      setState(() {});
    });
    animationB.addListener((){
      setState(() {});
    });
    animationA.forward(from: 0.125);
  }

  @override
  void dispose() {
    if(animationA != null) animationA.dispose();
    if(animationB != null) animationB.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    var cs = CYThemeData.of(context);

    final double width = showAnimationB ? 
      widget.width * (1 + animationB.value / 2) :  
      widget.width * animationA.value;

    final double opacity = showAnimationB ? 
      1 - animationB.value :
      (animationA.value - 0.125) / (1 - 0.125);

    return Container(
      width: widget.width*1.5,
      height: widget.width*1.5,
      alignment: Alignment.center,
      child: Opacity(
        opacity: opacity,
        child: Container(
          width: width,
          height: width,
          decoration: BoxDecoration(
            color: cs.primaryForeColor.withOpacity(0.15) ,
            borderRadius: BorderRadius.circular(width / 2)
          ),
          child: Image.asset(widget.path),
        ),
      )
    );
  }
}


class AvatarLoading extends StatefulWidget {
  AvatarLoading({ Key key, @required this.sourceList, this.radius = 79 }) : super(key: key);

  final List<String> sourceList;
  final double radius;

  @override
  _AvatarLoadingState createState() => _AvatarLoadingState();
}

class _AvatarLoadingState extends State<AvatarLoading> {
  int activeIndex = 0;
  bool loading = false;
  static Map<String, ui.Image> sourceMap = {};

  Timer timer;
  List<Widget> children = [];

  

  @override
  void initState() {
    double width = widget.radius * 2;
    timer = Timer.periodic(Duration(milliseconds: 400), (Timer _timer) {
      if(timer == null || !timer.isActive) _timer.cancel();
      activeIndex = (activeIndex + 1) % widget.sourceList.length;
      String path =  widget.sourceList[activeIndex];
      if(children.length>2) children.removeLast();
      children.insert(0, AvatarLoadingItem(key: Key(path), path: path, width: width,));
      setState(() {});
    });
    super.initState();
  }

  @override
  void dispose() { 
    if(timer != null) timer.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: children
    );
  }
}